12-20 微信商学院-开发者培训班

发表于 | 更新于 | 分类于

12-20 微信商学院-开发者培训班

小程序是什么

小程序的优点

  • 不是H5(算是类web应用,基于H5开发但是可以调用微信native API,缺点是不能对API进行定制)
  • 基于微信
  • 原生体验
  • 解决方案
  • 即用即走,随手可得
  • 拥有离线能力
  • 一次开发,多端兼容
  • 优秀的操作系统
  • 在安卓上的适配是最优的

小程序的接入流程

注册->开发->提交审核->发布

邮箱不能注册过其他组件(公众号,企业号等)

  • 只有管理员才能上传代码
  • 公测期间不支持发布
  • 不能做营销和游戏
  • 不做收集用户隐私的接口
  • 便捷:尽量减少输入,避免误操作
  • 统一:视觉统一,WeUI(可以根据它来调整,由自己的品牌来定制)
  • 审核规范:判断原则
    • 真实性,一致性(信息一一对应),稳定性,合法性
    • 常见拒绝原因:demo版本或trial版本,或仍存在bug
      • 提供的服务属于暂未开放的服务范围
      • 名称,简介,logo,服务范围没有对应关系
  • 单页面应用 Single Page Application
  • 动态加载
  • Framework Overview
  • 10M稳定存储能力,
  • jssdk ->小程序的API
  • API 拥有调取Native 系统层能力
  • Page Frame
    • 预先加载一个web view
    • 当打开指定页面时,无需请求额外资源,直接渲染
    • init–>ready–>nav–>ready->(从右边)push(100-200ms)(开发者最好自己也做一些点击态)
  • App Service -Manager
    • App() 小程序入口
    • Page() 页面入口
  • App Service -Life Cycle
    • Native加载两个线程 (view, App Service)
    • redirect (越过5层页面层级限制)
  • App Service -API
    • 通过JSbridge同客户端通信
    • 用户信息,微信支付,模版消息,网络通信,本地存储等等
  • View - Hybrid 混合应用
    • 凌驾于web view
    • web-like 开发方式
    • App-like 用户体验
  • View -WXML
    • 支持逻辑,算数计算
    • 支持模版,引用
    • (WXML)compiler–>(JS:generateFunc)date–>(Virtual Tree)Virtual DOM–>(View DOM)
  • View -WXSS
    • 自适应单位RPX- Responsive Pixel
    • 无级联(但是其实还是可以用的用)-避免被组件内结构破坏(最好别用)
    • (WXSS)Compiler–>(JS)Width,DPR–>(CSS)
  • View -Render
    • 数据M 和视图V 完全分离
    • 逻辑层运行在独立的环境中,无法直接操作DOM
    • 使用WXML模版语言减少维护成本
    • 单项数据绑定

Virtual-DOM

  • 生成和DOM tree – 对应的Virtual Tree
  • 对比新Tree和旧Tree的不同
  • 将这些不同的点应用到DOM Tree中
  • 动态改变的节点需要加上WX:key 来做节点的唯一标示
  • wx:if,wx:for,template增加一个<virtual/>的节点
  • diff
  • native 凌驾于webview 有些webview层中的一些事件(比如滑动)不能在原生环境中监听

技术人员分享

  • 单向数据流
  • 局部化组件
  • 不携带cookie
  • globalData事件订阅
  • 页面传值
  • server层
  • 1M限制(用图片替代代码来越过限制,不推荐)
  • react与小程序语法替换关系
    • state ==> data
    • setState ==> setData
    • array.map ==> war.map